<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/static/layui/css/layui.css">
</head>
<body>
<div class="layui-container">
    <div class="layui-row">
        <form class="layui-form" lay-filter="form1" id="form1">
            <div class="layui-form-item">
                <input placeholder="姓名" class="layui-input" name="name" required>
            </div>
            <div class="layui-form-item">
                <input placeholder="身份证" class="layui-input" name="cardId" required>
            </div>
            <div class="layui-form-item">
                <input placeholder="年龄" class="layui-input" name="age">
            </div>
            <div class="layui-form-item">
                <select name="sex">
                    <option value="男">男</option>
                    <option value="女">女</option>
                </select>
            </div>
            <div class="layui-form-item">
                <input placeholder="手机号" class="layui-input" name="phone">
            </div>
            <div class="layui-form-item">
                <textarea placeholder="地址" class="layui-textarea" name="address"></textarea>
            </div>
            <div class="layui-form-item">
                <button class="layui-btn" type="button" onclick="sure()">确认</button>
            </div>
        </form>
    </div>
</div>
</body>
<script type="text/javascript" src="/static/layui/layui.all.js"></script>
<script type="text/javascript">
    const form = layui.form;
    const $ = layui.$;
    const baseUrl = "http://127.0.0.1:6677";

    function sure() {
        const val = form.val('form1');
        console.log(val);
        $.post({
            url: baseUrl + "/demo5/addUser",
            contentType: "application/json",
            data: JSON.stringify(val),
            success: function (res) {
                console.log(res);
                layui.layer.msg("添加成功");
                $("#form1")[0].reset();
            },
            error: function (res) {
                console.log(res);
                layui.layer.msg("添加失败 " + res['responseJSON']['error']);
            }
        });
    }
</script>
</html>
